<!doctype html>
<html class="no-js">
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>博文添加</title>
  <meta name="description" content="这是一个 user 页面">
  <meta name="keywords" content="user">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="renderer" content="webkit">
  <meta http-equiv="Cache-Control" content="no-siteapp" />
  <link rel="icon" type="image/png" href="/Public/assets/i/favicon.png">
  <link rel="apple-touch-icon-precomposed" href="/Public/assets/i/app-icon72x72@2x.png">
  <meta name="apple-mobile-web-app-title" content="Amaze UI" />
  <link rel="stylesheet" href="/Public/assets/css/amazeui.min.css"/>
  <link rel="stylesheet" href="/Public/assets/css/admin.css">
    <link rel="stylesheet" href="/Public/assets/css/demo.css">
  <!-- 引用控制层插件样式 -->
  <link rel="stylesheet" href="/Public/tools/php_img_upload/control/css/zyUpload.css" type="text/css">


</head>
<body>
<!--[if lte IE 9]>
<p class="browsehappy">你正在使用<strong>过时</strong>的浏览器，Amaze UI 暂不支持。 请 <a href="http://browsehappy.com/" target="_blank">升级浏览器</a>
  以获得更好的体验！</p>
<![endif]-->

<include file="./Application/Admin/View/Share/header.html"/>

<div class="am-cf admin-main">
  <!-- sidebar start -->

  <!-- sidebar end -->
  <include file="./Application/Admin/View/Share/left.html"/>
  <!-- content start -->
  
  <div class="am-modal am-modal-no-btn" tabindex="-1" id="doc-modal-1">
    <div class="am-modal-dialog">
      <div class="am-modal-hd">上传图片
        <a href="javascript: void(0)" class="am-close am-close-spin" data-am-modal-close>&times;</a>
      </div>
	  <div class="am-modal-bd">
		  <div id="demo" class="demo"></div>
	  </div>
    </div>
  </div>
  
  
  <div class="admin-content">
    <div class="admin-content-body">
      <div class="am-cf am-padding am-padding-bottom-0">
        <div class="am-fl am-cf"><strong class="am-text-primary am-text-lg">博文添加</strong> / <small>Article Add</small></div>
      </div>

      <hr/>

      <div class="am-g">
        <div class="am-u-sm-12 am-u-md-4 am-u-md-push-8">
          <div class="am-panel am-panel-default">
            <div class="am-panel-bd">
              <div class="am-g">
                <div class="am-u-md-4">
                  <img class="am-img-circle am-img-thumbnail" src="http://s.amazeui.org/media/i/demos/bw-2014-06-19.jpg?imageView/1/w/200/h/200/q/80" alt=""/>
                </div>
                <div class="am-u-md-8">
                  <p>你可以使用<a href="#">gravatar.com</a>提供的头像或者使用本地上传头像。 </p>
                  <form class="am-form">
                    <div class="am-form-group">
                      <input type="file" id="user-pic">
                      <p class="am-form-help">请选择要上传的文件...</p>
                      <button type="button" class="am-btn am-btn-primary am-btn-xs">保存</button>
                    </div>
                  </form>
                </div>
              </div>
            </div>
          </div>

          <div class="am-panel am-panel-default">
            <div class="am-panel-bd">
              <div class="user-info">
                <p>等级信息</p>
                <div class="am-progress am-progress-sm">
                  <div class="am-progress-bar" style="width: 60%"></div>
                </div>
                <p class="user-info-order">当前等级：<strong>LV8</strong> 活跃天数：<strong>587</strong> 距离下一级别：<strong>160</strong></p>
              </div>
              <div class="user-info">
                <p>信用信息</p>
                <div class="am-progress am-progress-sm">
                  <div class="am-progress-bar am-progress-bar-success" style="width: 80%"></div>
                </div>
                <p class="user-info-order">信用等级：正常当前 信用积分：<strong>80</strong></p>
              </div>
            </div>
          </div>

        </div>

        <div class="am-u-sm-12 am-u-md-8 am-u-md-pull-4">
          <form class="am-form am-form-horizontal" name="article_form" enctype="multipart/form-data" action="/Admin/Article/insert?id=<{$id}>" method="post">
            <div class="am-form-group">
              <label for="user-name" class="am-u-sm-3 am-form-label">博文标题</label>
              <div class="am-u-sm-9">
                <input type="text" id="user-name" placeholder="博文标题" name="title" value="<{$result.title}>">
                <small>输入你的博文标题。</small>
              </div>
            </div>
			
			<div class="am-form-group">
              <label for="user-name" class="am-u-sm-3 am-form-label">文章类别</label>
              <div class="am-u-sm-9">
                <select id="doc-select-1" name="name">
					<volist name="res" id="vo">
						<option><{$vo.name}></option>
					</volist>
				</select>
				
				<span class="am-form-caret"></span>
              </div>
            </div>
            		
            <div class="am-form-group">
              <label for="user-email" class="am-u-sm-3 am-form-label">作者</label>
              <div class="am-u-sm-9">
                <input type="email" id="user-email" placeholder="作者" name="author" value="<{$result.author}>">
                <!--small>邮箱你懂得...</small-->
              </div>
            </div>

            <div class="am-form-group">
              <label for="user-phone" class="am-u-sm-3 am-form-label">封面图</label>
              <div class="am-u-sm-9">
                <input type="file" id="user-pic" name="img_src">
                <!--button type="button" class="am-btn am-btn-primary am-radius" data-am-modal="{target: '#doc-modal-1', closeViaDimmer: 0, width: 800, height: 400}"-->上传图片</button>
                <img src="<{$result.img_src}>" width="100px"/>
                <input type="hidden" name=""/>
              </div>
            </div>

            <!--div class="am-form-group">
              <label for="user-QQ" class="am-u-sm-3 am-form-label">博文简介</label>
              <div class="am-u-sm-9">
                <input type="number" pattern="[0-9]*" id="user-QQ" placeholder="输入博文简介">
              </div>
            </div-->

            <div class="am-form-group">
              <label for="user-weibo" class="am-u-sm-3 am-form-label">博文简介</label>
              <div class="am-u-sm-9">
                <input type="text" id="user-weibo" placeholder="输入你的博文" name="introduction" value="<{$result.introduction}>">
              </div>
            </div>

            <div class="am-form-group">
              <label for="user-intro" class="am-u-sm-3 am-form-label">博文内容</label>
              <div class="am-u-sm-9">
                <script id="container" name="content" type="text/plain"><{$result.content}></script>
                <small>250字以内写出你的一生...</small>
              </div>
            </div>

            <div class="am-form-group">
              <div class="am-u-sm-9 am-u-sm-push-3">
                <button type="button" onclick="do_submit()" class="am-btn am-btn-primary">保存修改</button>
              </div>
            </div>
          </form>
        </div>
      </div>
    </div>

    <footer class="admin-content-footer">
      <hr>
      <p class="am-padding-left">© 2014 AllMobilize, Inc. Licensed under MIT license.</p>
    </footer>

  </div>
  <!-- content end -->

</div>

<a href="#" class="am-icon-btn am-icon-th-list am-show-sm-only admin-menu" data-am-offcanvas="{target: '#admin-offcanvas'}"></a>

<footer>
  <hr>
  <p class="am-padding-left">© 2014 AllMobilize, Inc. Licensed under MIT license.</p>
</footer>

<!--[if lt IE 9]>
<script src="http://libs.baidu.com/jquery/1.11.3/jquery.min.js"></script>
<script src="http://cdn.staticfile.org/modernizr/2.8.3/modernizr.js"></script>
<script src="assets/js/amazeui.ie8polyfill.min.js"></script>
<![endif]-->

<!--[if (gte IE 9)|!(IE)]><!-->
<script src="/Public/assets/js/jquery.min.js"></script>
<!--<![endif]-->
<script src="/Public/assets/js/amazeui.min.js"></script>

<script src="/Public/assets/js/app.js"></script>
<!-- 配置文件 -->
<script type="text/javascript" src="/Public/tools/UEditor/ueditor.config.js"></script>
<!-- 编辑器源码文件 -->
<script type="text/javascript" src="/Public/tools/UEditor/ueditor.all.js"></script>
<!-- 实例化编辑器 -->
<script type="text/javascript" src="/Public/tools/php_img_upload/core/zyFile.js"></script>
<!-- 引用控制层插件 -->
<script type="text/javascript" src="/Public/tools/php_img_upload/control/js/zyUpload.js"></script>
<!-- 引用初始化JS -->


<script type="text/javascript">
	var ue = UE.getEditor('container');
	
function do_submit(){
	document.article_form.submit();
}

$(function(){
		// 初始化插件
		var width = $(window).width();
		if ( width >= 650 )	 width = '750px';
		else 	width = "100%";

		$("#demo").zyUpload({
			width            :   width,                 // 宽度
			height           :   "auto",                 // 宽度
			itemWidth        :   "140px",                 // 文件项的宽度
			itemHeight       :   "100px",                 // 文件项的高度
			//url              :   "/upload/UploadAction",  // 上传文件的路径
			url              :   "/Admin/Photo/imgUpload?id=0",
			inputName		 : 	'_img',
			id 				 :	 1,
			multiple         :   true,                    // 是否可以多个文件上传
			dragDrop         :   false,                    // 是否可以拖动上传文件
			del              :   true,                    // 是否可以删除文件
			finishDel        :   false,  				  // 是否在上传文件完成后删除预览
			/* 外部获得的回调接口 */
			onSelect: function(selectFiles, allFiles){    // 选择文件的回调方法  selectFile:当前选中的文件  allFiles:还没上传的全部文件
				console.info("当前选择了以下文件：");
				console.info(selectFiles);
			},
			onProgress: function(file, loaded, total){    // 正在上传的进度的回调方法
				var eleProgress = $("#uploadProgress_" + file.index), percent = (loaded / total * 100).toFixed(2) + '%';
				eleProgress.html(percent);
				console.info(file.index);
				console.info("当前正在上传此文件：");
				console.info(file.name);
				console.info("进度等信息如下：");
				console.info(loaded);
				console.info(total);
			},   
			onDelete: function(file, files){              // 删除一个文件的回调方法 file:当前删除的文件  files:删除之后的文件
				console.info("当前删除了此文件：");
				console.info(file.name);
			},
			onSuccess: function(file, response){          // 文件上传成功的回调方法
				console.info("此文件上传成功：");
				$('#successinfo').append("<p>"+response+"</p>");
				console.info(response);
				//alert(response);
			},
			onFailure: function(file, response){          // 文件上传失败的回调方法
				$("#uploadImage_" + file.index).css("opacity", 0.2);
				console.info("此文件上传失败：");
				console.info(file.name);
			},
			onComplete: function(response){           	  // 上传完成的回调方法
				console.info("文件上传完成");
				console.info(response);
			}
		});
		
	});

</script>
</body>
</html>
